<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsp/jstl/fmt"%>
<html>
    <head>
        <title>DriveNotes::Места</title>
        <link href="css/style.css" rel="stylesheet" type="text/css"/>
        <script src="js/jquery.js"></script>
        <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
        <script>
            var map;
            var markers;
            var marker;
            var zoom = 15;

            $(function() {
                map = new OpenLayers.Map("map");
                map.addLayer(new OpenLayers.Layer.OSM());
                map.zoomTo(1);
            });

            function centerMapTo(lon, lat) {
                var lonLat = new OpenLayers.LonLat(lon, lat)
                .transform(
                new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
                map.getProjectionObject() // to Spherical Mercator Projection
            );

                if(markers == null) {
                    markers = new OpenLayers.Layer.Markers("Markers");
                    map.addLayer(markers);
                } else if (marker != null) {
                    markers.removeMarker(marker);
                }

                marker = new OpenLayers.Marker(lonLat);
                markers.addMarker(marker);
                map.setCenter (lonLat, zoom);
            }
        </script>
    </head>
    <body>
        <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>&nbsp;</td>
                <td width="750" valign="top">
                    <table width="750" height="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td height="1">
                                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                        <td valign="top" background="images/p1-bg.jpg" class="norepeat">
                                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td><img src="images/spacer.gif" alt="" width="1" height="46"/></td>
                                                    <td>&nbsp;</td>
                                                    <td>&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td width="1"><img src="images/spacer.gif" width="17" height="1"/></td>
                                                    <td width="1"><img src="images/logo.jpg" alt="" width="50" height="51"/></td>
                                                    <td class="c_name"><xsl:value-of select="dn/page-title"/></td>
                                    </tr>
                                </table>
                            </td>
                            <td width="1"><img src="images/p2.jpg" alt="" width="331" height="255"/></td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td height="100%" valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td width="1" valign="top"><img src="images/spacer.gif" alt="" width="9" height="1"/></td>
                            <td height="100%" valign="top"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td background="images/menu-1-bg.gif" class="norepeat"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=garage" class="menu_lnk">Гараж</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    <tr>
                                        <td background="images/menu-2-bg.gif" bgcolor="#3F3F3F" class="norepeat"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=service" class="menu_lnk">Сервис</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=filling" class="menu_lnk">Заправка</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=notes" class="menu_lnk">Заметки</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=places" class="menu_lnk">Места</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    <tr>
                                        <td bgcolor="#3F3F3F"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                    <td class="menu"><a href="controller?act=statistic" class="menu_lnk">Статистика</a></td>
                                                </tr>
                                            </table></td>
                                    </tr>
                                    <tr>
                                        <td><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                    </tr>
                                    
                                        <tr>
                                            <td bgcolor="#3F3F3F"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                        <td width="1"><img src="images/menu-bullet.gif" alt="" width="36" height="30"/></td>
                                                        <td class="menu"><a href="controller?act=logout" class="menu_lnk">Выход</a></td>
                                                    </tr>
                                                </table></td>
                                        </tr>
                                        <tr>
                                            <td><img src="images/menu-sep.gif" alt="" width="181" height="1"/></td>
                                        </tr>
                                   
                                    <tr>
                                        <td height="100%" bgcolor="#3f3f3f">&nbsp;</td>
                                    </tr>
                                    <tr>
                                        <td background="images/menu-bot-bg.gif" class="bgx"><img src="images/menu-bot-bg.gif" width="1" height="97"/></td>
                                    </tr>
                                </table>
                            </td>
                            <td width="1" valign="top">
                                <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td><img src="images/c-top.jpg" alt="" width="560" height="17"/></td>
                                    </tr>
                                    <tr>
                                        <td><h1>DriveNotes::Места</h1></td>
                                    </tr>
                                    <tr>
                                        <td height="100%" class="body_txt">
                                            <p>
                                            <div id="map"></div><br/>
                                            <a href="controller?act=editPlace">Добавить место</a>
                                    <c:choose>
                                        <c:when test="${not empty places}">
                                            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                                                <c:forEach items="${places}" var="place">
                                                    <tr>
                                                        <td colspan="2">
                                                            <a class="js_link" href="#" onclick="centerMapTo(${place.lon},${place.lat})">
                                                                <h3>${place.name}</h3>
                                                            </a>
                                                        </td>
                                                    </tr>
                                                    <c:if test="${not empty place.description}">
                                                        <tr><td colspan="2">"${place.description}"</td></tr>
                                                        <tr><td colspan="2">&nbsp;</td></tr>
                                                    </c:if>
                                                    <tr><td colspan="2">Широта: "${place.lat}"</td></tr>
                                                    <tr><td>Долгота: "${place.lon}"</td></tr>
                                                    <tr><td colspan="2"><a href="controller?act=editPlace&amp;subact=del&amp;placeId=${place.id}">Удалить</a>&nbsp;<a href="controller?act=editPlace&amp;placeId=${place.id}">Редактировать</a></td></tr>
                                                    <tr><td colspan="2">&nbsp;</td></tr>
                                                </c:forEach>
                                            </table>
                                        </c:when>
                                        <c:otherwise>
                                            <div>Вы не добавили не одного места</div>
                                        </c:otherwise>
                                    </c:choose>
                                    </p>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table></td>
</tr>
<tr>
    <td height="1" background="images/bottom-bg.jpg" class="norepeat"><table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
                
            </tr>
            <tr>
                <td class="bottom_addr">2011 DriveNotes (c).</td>
            </tr>
        </table></td>
</tr>
</table>
</td>
<td>&nbsp;</td>
</tr>
</table>
</body>
</html>

